<!--eslint eqeqeq:0-->
<template>
  <el-select
    ref="selectData"
    :value="value"
    :clearable="true"
    :multiple="multiple"
    filterable
    :disabled="isDisabled"
    :placeholder="placeholder"
    :popper-append-to-body="false"
    transfer="true"
    @input="change($event)"
    @change="selectChange"
  >
    <el-option v-for="item in selectList" :key="item.code + ''" :label="item.text" :value="item.code" />
  </el-select>
</template>

<script>
import request from '@/utils/request'

export default {
  name: 'CommonSelect',
  props: {
    name: {
      type: String,
      default: ''
    },
    placetext: {
      type: String,
      default: ''
    },
    value: {
      type: String,
      default: ''
    },
    disabled: {
      type: Boolean,
      default: false
    },
    multiple: {
      type: Boolean,
      default: false
    },
    hiddenvalues: {
      type: String,
      default: ''
    },
    text: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      selectList: [],
      placeholder: this.placetext,
      operatorProps: this.operator,
      isDisabled: !!this.disabled,
      isClearable: this.clearable === undefined ? true : !!this.clearable,
      hideValueList: this.hiddenvalues ? this.hiddenvalues.split(',') : []
    }
  },
  computed: {
    imageUrl() {
      return this.value
    }
  },
  watch: {
    disabled: function(val) {
      this.isDisabled = !!val;
    },
    clearable: function(val) {
      this.isClearable = !!val;
    }
  },
  mounted: function() {
    this.getData();
  },
  methods: {
    getData: function() {
      var _this = this;
      request({
        url: `/common/dict/getDictDataByName/${this.name}`
      }).then(res => {
        if (_this.hideValueList) {
          _this.selectList = res.data.filter(function(item) {
            let isHide = false;
            for (let i = 0; i < _this.hideValueList.length; i++) {
              if (item.code === _this.hideValueList[i]) {
                isHide = true
              }
            }
            return !isHide;
          });
          if (_this.text === 'text') {
            _this.setCodeToText();
          }
        } else {
          _this.selectList = res.data;
          if (_this.text === 'text') {
            _this.setCodeToText();
          }
        }
      })
    },
    setCodeToText() {
      for (let i = 0, len = this.selectList.length; i < len; i++) {
        this.selectList[i].code = this.selectList[i].text;
      }
    },
    selectChange: function(value) {
      this.$emit('select-change', value);
    },
    change: function(value) {
      this.$emit('input', value);
    }
  }
}
</script>

<style lang="scss" scoped>

</style>
